﻿define(function (require, exports, module) {
    var ImageStorage = require('imageStorage');
    var Canvas = require('canvas');
    var Config = require('config');
    var Game = require('game');

    var m_backgroundLayer;
    var m_buttonLayer;
    var m_form;
    var m_txtName;
    var m_txtPwd;

    var m_loginConfigs = [{//登录按钮
        overImageSrc: 'images/other/btn_login_white.png',
        outImageSrc: 'images/other/btn_login_gray.png',
        x: 321,
        y: 318,
        click: function () {
            m_loginClickAsync(this).start();
        }
    }, {//退出按钮
        overImageSrc: 'images/other/btn_quit_white.png',
        outImageSrc: 'images/other/btn_quit_gray.png',
        x: 375,
        y: 425,
        click: function () {
            window.opener = null;
            window.open(null, '_self');
            window.close();
        }
    }];

    exports.login = function () {
        m_backgroundLayer = Canvas.createLayer();
        m_buttonLayer = Canvas.createLayer();
        m_renderLoginAsync().start();
    };

    var m_renderLoginAsync = eval(Wind.compile('async', function () {
        $await(m_drawLoginButtonsAsync());
        $await(m_drawLoginBackgroundAsync());

        Canvas.add(m_backgroundLayer);
        Canvas.add(m_buttonLayer);

        m_form = $('<form>').attr('action', 'login.do').appendTo(document.body);
        m_txtName = $('<input name="name" type="text">').css({
            border: 0,
            position: 'absolute',
            zIndex: 5,
            top: 230,
            left: 397,
            width: 141,
            height: 20,
            fontSize: 17
        }).appendTo(m_form);
        m_txtPwd = $('<input name="password" type="password">').css({
            border: 0,
            position: 'absolute',
            zIndex: 5,
            top: 267,
            left: 397,
            width: 141,
            height: 20,
            fontSize: 17
        }).appendTo(m_form);
        m_txtName.focus();
    }));

    var m_drawLoginButtonsAsync = eval(Wind.compile('async', function () {
        for (var i = 0, config; config = m_loginConfigs[i]; i++) {
            var overImage = $await(ImageStorage.getAsync(config.overImageSrc));
            var outImage = $await(ImageStorage.getAsync(config.outImageSrc));
            var btnImage = Canvas.createImageButton({
                image: outImage, x: config.x, y: config.y,
                mouseover: function () {
                    btnImage.setImage(overImage);
                    m_buttonLayer.draw();
                },
                mouseout: function () {
                    btnImage.setImage(outImage);
                    m_buttonLayer.draw();
                }
            });
            m_buttonLayer.add(btnImage);

            btnImage.on('click', config.click);
        };
    }));

    var m_loginClickAsync = eval(Wind.compile('async', function (btn) {
        if ('' == m_txtName.val().trim() || '' == m_txtPwd.val().trim()) {
            m_txtName.focus();
            return;
        }
        btn.off('click');
        var response = $await(formAjaxTask(m_form));
        if (response.Success) {
            m_form.remove();
            Canvas.clear();
            Game.start();
        }
        else {
            alert(response.Message);
        }
        $await(Wind.Async.sleep(100));
        btn.on('click', m_loginConfigs[0].click);
    }));

    function formAjaxTask(form, options) {
        return Wind.Async.Task.create(function (t) {
            form.ajaxSubmit({
                success: function (data, textStatus, jqXHR) {
                    t.complete('success', data);
                }
            });
        });
    };

    var m_drawLoginBackgroundAsync = eval(Wind.compile('async', function () {
        var img = $await(ImageStorage.getAsync('images/other/login.gif'));
        var bgImage = new Canvas.createImage({ image: img });
        m_backgroundLayer.add(bgImage);
    }));

    exports.register = function () {
    };

    exports.getPwdBack = function () {
    };
});